<!--# layout("/common/layout.html",{"jsBase":"/js/cms/renting/"}){ -->

<form class="layui-form " id="addForm">
    <!--# include("/cms/common/basic.html",{"basic":essentialInformation}){} -->
    <fieldset class="layui-elem-field">
        <legend>租房补贴申报信息</legend>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">申报档次<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <layui:simpleDictSelect style='layui-input-inline' type="declarationGrade"
                                                id="declarationGrade" name="declarationGrade"
                                                 layVerify="required" lay-filter="declareYear"/>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">可申报月数<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <select name="numberDeclarations" maxVla="${sumMonth}" id="numberDeclarations" lay-verify="required" lay-filter="declareYear1" >
                            <option value="">请选择月份</option>
                            <!--# for(var i=1;i<=sumMonth;i++){  -->
                            <option value="${i}">${i}</option>
                            <!--# }-->
                        </select>
                        <!--<input type="text" id="numberDeclarations" name="numberDeclarations"   class="layui-input" lay-verify="required|number">-->
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">合计金额<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <input type="text" id="totalAmount" name="totalAmount"   class="layui-input input-readonly" lay-verify="required|number" readonly>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">申报人类别<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <layui:simpleDictSelect style='layui-input-inline' type="declarationCategory"
                                                id="declarationCategory" name="declarationCategory"
                                                 layVerify="required" />
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">专业技术资格名称</label>
                    <div class="layui-input-inline">
                        <input type="text" id="technicalQualification" name="technicalQualification"    class="layui-input" >
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">专业等级</label>
                    <div class="layui-input-inline">
                        <input type="text" id="professionalGrade" name="professionalGrade"     class="layui-input" >
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">职业技能资格名称</label>
                    <div class="layui-input-inline">
                        <input type="text" id="vocationalQualification" name="vocationalQualification"    class="layui-input" >
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">职业等级</label>
                    <div class="layui-input-inline">
                        <input type="text" id="vocationalGrade" name="vocationalGrade"    class="layui-input" >
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">在申报企业网上就业登记备案开始日期<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <input type="text"  name="startDate"  class="layui-input input-date"  lay-verify="required">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">在申报企业网上就业登记备案结束日期<span style="color: red">*</span></label>
                    <div class="layui-input-inline">
                        <input type="text"  id="endDate" name="endDate"  class="layui-input input-date"  lay-verify="required">
                    </div>
                    <div class="layui-input-inline">
                        <input type="button" id="endDate1" value="无固定期限">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">特殊情况说明(最多100汉字)</label>
                    <div class="layui-input-inline">
                        <textarea id="specialInstructions" name="specialInstructions"   class="layui-textarea" style="width: 740px" maxlength="200"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </fieldset>
    <!--#
        if(essentialInformation.maritalStatus != "2"){
               -->
    <fieldset class="layui-elem-field" id="addColumn">
        <legend>已婚申报人的配偶、未成年子女信息</legend>
        <!--#
               if(essentialInformation.maritalStatus=="1" ){
               -->
        <label class="layui-form-label" style="font-size: 22px;">配偶：</label>
        <input type="hidden" name="relationship-0" value="0" >
        <div class="layui-row">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-inline">
                        <input type="text"  name="relativesName-0"  class="layui-input" value="" lay-verify="required" >
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">证件类别</label>
                    <div class="layui-input-inline">
                        <layui:simpleDictSelect style='layui-input-inline' type="idType" id="idType" name="relativesIdType-0" value="" />
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">证件号码</label>
                    <div class="layui-input-inline">
                        <input type="text"  name="relativesIdNumber-0"  class="layui-input " >
                    </div>
                </div>
            </div>
        </div>
        <!--# }-->
        <!--#
               if(essentialInformation.maritalStatus=="1" || essentialInformation.maritalStatus=="3"){
               -->
        <label class="layui-form-label" style="font-size: 22px;">子女：</label>
        <input type="button" class="layui-btn" id="addRowClick" value="添加一行">
        <div id="commDivRow" class="layui-row" style="margin-top: 10px;">
            <input type="hidden" name="relationship" value="1" >
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-inline">
                        <input type="text"  name="relativesName" class="layui-input" lay-verify="required" >
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">证件类别</label>
                    <div class="layui-input-inline">
                        <layui:simpleDictSelect style='layui-input-inline' type="idType" name="relativesIdType" value=""  />
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">证件号码</label>
                    <div class="layui-input-inline">
                        <input type="text"  name="relativesIdNumber"  class="layui-input " >
                    </div>
                </div>
            </div>
        </div>
        <!--# }-->
    </fieldset>
    <!--# }-->
    <fieldset class="layui-elem-field">
        <legend>材料信息</legend>
        <span style="color: red;margin-left: 30px;font-size: 18px">支持文件格式为：pdf,jpg,png,gif，单个文件大小不超过20M。带*号标识的对应资料必须上传，其它资料不作要求。上传文件内容请确保真实清晰、有效，不能有旋转。上传后请查看预览，正确无误后再申报提交。</span>
                <div class="layui-row">
                        <label class="layui-form-label file-upload">身份证件<span style="color: red">*</span></label>
                        <layui:attachment name="Idfile" batchFileUUID="${uuid()}" isNew="true" lay-verify="required" bizType="User"/>
                </div>
                <div class="layui-row">
                        <label class="layui-form-label file-upload">银行卡材料信息<span style="color: red">*</span></label>
                            <layui:attachment name="banknumber" batchFileUUID="${uuid()}" isNew="true" lay-verify="required" bizType="User"/>
                </div>
                <div class="layui-row">
                    <label class="layui-form-label file-upload">租房合同	<!--<span style="color: red">*</span>--></label>
                    <layui:attachment name="rentingHouse" batchFileUUID="${uuid()}" isNew="true"  bizType="User"/>
             </div>
                <div class="layui-row">
                        <label class="layui-form-label file-upload">相关证书<span style="color: red">*</span></label>
                        <layui:attachment name="qualificationCertificate" batchFileUUID="${uuid()}" isNew="true" lay-verify="required" bizType="User"/>
                </div>
                <div class="layui-row">
                    <label class="layui-form-label file-upload">劳动合同书或劳动合同协议</label>
                    <layui:attachment name="laborContract" batchFileUUID="${uuid()}" isNew="true" lay-verify="required" bizType="User"/>
                </div>
    </fieldset>
    <layui:personnelsubmitButtons id="addButton" />
</form>
<!--#} -->
<script>

    //页面加载完成 根据下拉框内容排序 在重新渲染下拉框
    $(document).ready(function(){
        sortOption("declarationGrade");
        //form.render('select', 'declareYear');
    });

    $(document).on('click','#endDate1',function() {
        $("#endDate").val("2099-12-31")
    });

    /**
     * 添加一行
     * @type {number}
     */
    var i=0;
    $(document).on('click','#addRowClick',function(){
        var form = layui.form;
        i++;
        var html = $("#commDivRow").html();
        //去除右边空格
        html = html.replace(/(\s*$)/g,"");
        //移除最后一个</div>标签
        html=html.substring(0,html.length-4);
        //组装新代码
        html ="<div id=\"test"+i+"\" class=\"layui-row\" >"+ html + "<div class=\"layui-inline\"><div class=\"layui-btn-group\"><button type=\"button\" class=\"layui-btn layui-btn-primary layui-btn-sm\" " +
            "onclick=\"removeInput('" +i+ "')\"><i class=\"layui-icon\">&#xe640;</i></button></div></div></div>";
        $("#addColumn").append(html);
        form.render('select');
    });

    /**
     * 移除一行
     * @param id
     */
    function removeInput(id) {
        $('#test'+id+'').remove();
    };

    layui.use(['add'], function(){
        var rentingAdd = layui.add;
        rentingAdd.init();

        var form = layui.form;
        form.on('select(declareYear)', function (data) {
            var grade=data.elem[data.elem.selectedIndex].text;
            var month =$("#numberDeclarations").val();
            $("#totalAmount").val(grade*month);
        });

        form.on('select(declareYear1)', function () {
            var grade=$("#declarationGrade").find("option:selected").text();
            var month =$("#numberDeclarations").val();
            $("#totalAmount").val(grade*month);
        });

    });

</script>
